<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <link href="/styles/base.css" rel="stylesheet" type="text/css">
    <link href="/styles/destfilter.css" rel="stylesheet" type="text/css">
    <link href="/styles/gonglve.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/common.js"></script>
    <script type="text/javascript" src="/js/destfilter.js></script>
    <script type="text/javascript" src="/js/destionation.js"></script>
    <script type="text/javascript" src="/js/jquery/jquery.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-form/jquery.form.js"></script>
    <link href="/js/plugins/jqPaginator/jqPagination.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/plugins/jqPaginator/jq-paginator.min.js"></script>
    <script type="text/javascript" src="/js/system/gonglve.js"></script>
</head>

<script>
    $(function () {
        $("#searchForm").ajaxForm(function (data) {
            $("#strategySearchPageData").html(data);
        });
       // $("#searchForm").submit();

        //页面跳转过来获取url后的参数
        var href = window.location.href;
        var strings = href.split("?");
        var str = strings[1];
        if (str) {

            var ss = str.split("=");
            if (ss[0] == "id") {
                $(".month1").removeClass("upt_on");
                $(".month1").each(function () {
                    var num = ss[1];
                    $('#month').val(num)
                    var month = $(this).data("month");
                    if (num == month) {
                        cl = "upt_on"
                        $(this).addClass(cl);

                        $("#searchForm").submit();
                    }
                })
            }if(ss[0] == "themeId"){
                $(".themeId").removeClass("upt_on");
                $(".themeId").each(function () {
                    var num = ss[1];
                    $('#themeId').val(num)
                    var themeId = $(this).data("themeid");
                    if (num == themeId) {
                        cl = "upt_on"
                        $(this).addClass(cl);

                        $("#searchForm").submit();
                    }
                })
            }
            else{
                    $(".festival").removeClass("upt_on");
                    $(".festival").each(function () {
                        var num = ss[1]-33;
                        $('#month').val(num)
                        var month = $(this).data("month");
                    if (num == month) {
                        cl = "upt_on"
                        $(this).addClass(cl);
                        $("#searchForm").submit();
                    }
                })
            }
        } else {
            $("#searchForm").submit();
        }
    })


</script>
<style>
    .upt_on {
        background-color: #ff9d00;
        color: #fff !important;
        text-decoration: none;
    }

</style>

<body>
<#assign currentNav="destination">
<#include "../common/navbar.ftl">
<div class="wrapper">
    <div class="top-bar">
        <div class="crumb">
            <div class="item"><a href="/destination" target="_blank">目的地</a><em>&gt;</em></div>
            <div class="item cur">目的地筛选</div>
        </div>
    </div>
    <div class="filter-title">目的地筛选</div>
    <div class="clear"></div>

    <div class="gl_wrap">
        <h3>
            <a href="javascript:;">时间</a>
        </h3>
        <ol>
            <li>
                <a href="javascript:;" class=" festival month" data-month="-1">不限</a>
            </li>

            <li>
                <a href="javascript:;" class=" month month1" data-month="1">1月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="2">2月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="3">3月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="4">4月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="5">5月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="6">6月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="7">7月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="8">8月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="9">9月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="10">10月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="11">11月</a>
            </li>
            <li>
                <a href="javascript:;" class=" month month1" data-month="12">12月</a>
            </li>


        </ol>
    </div>

    <div class="gl_wrap">
        <ol>
            <li>
                <a href="javascript:;" class=" festival month" data-month="1">元旦</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="2">春节<a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="3">清明</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="4">五一</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="5">端午</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="6">中秋</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="7">寒假</a>
            </li>
            <li>
                <a href="javascript:;" class=" festival month" data-month="8">暑假</a>
            </li>
        </ol>
</div>


    <div class="gl_wrap">
        <h3>
            <a href="javascript:;">主题</a>
        </h3>

        <ol>
            <li>
                <a href="javascript:;" class="themeId" data-themeid="-1">不限</a>
            </li>
            <li>
                <a href="javascript:;"><strong>全年不限:</strong></a>
            </li>
            <#list wholeyear as c>
                <li>
                    <a href="javascript:;" class="themeId" data-themeid="${c.id!}">${c.name!}</a>
                </li>
            </#list>

        </ol>
    </div>
    <div class="gl_wrap">
        <ol>
            <li>
                <a href="javascript:;"><strong>季节 :</strong></a>
            </li>
            <#list season as c>
                <li>
                    <a href="javascript:;" class="themeId" data-themeid="${c.id!}">${c.name!}</a>
                </li>
            </#list>

        </ol>
        </div>
    <div class="gl_wrap">
        <ol>
            <li>
                <a href="javascript:;"><strong>出行方式:</strong></strong></a>
            </li>
            <#list travel as c>
                <li>
                    <a href="javascript:;" class="themeId" data-themeid="${c.id!}">${c.name!}</a>
                </li>
            </#list>
        </ol>
    </div>

    <div class="gl_wrap">
        <h3>
            <a href="javascript:;" class="themeIdFromController" data-themeid="${themeId!}">天数</a>
        </h3>
        <ol>
            <li>
                <a href="javascript:;" class=" days" data-days="-1">不限</a>
            </li>
            <li>
                <a href="javascript:;" class=" days" data-days="2">2-3天</a>
            </li>
            <li>
                <a href="javascript:;" class=" days" data-days="4">4-5天</a>
            </li>
            <li>
                <a href="javascript:;" class=" days" data-days="6">6-9天</a>
            </li>
            <li>
                <a href="javascript:;" class=" days" data-days="10">10天以上</a>
            </li>
        </ol>
    </div>

    <!--数据-->
    <form action="/destination/searchData" method="post" id="searchForm">
        <input type="hidden" name="currentPage" id="currentPage" value="1">
        <input type="hidden" name="themeId" id="themeId" value="-1">
        <input type="hidden" name="month" id="month" value="-1">
        <input type="hidden" name="days" id="days" value="-1">
        <div id="strategySearchPageData">
        </div>
    </form>
    <script>

        $(".days").click(function () {
            var days = $(this).data("days");
            cl = "upt_on"
            $(".days").removeClass(cl);
            $(this).addClass(cl);
            $("#days").val(days);
            $("#currentPage").val(1);
            $("#searchForm").submit();
        })
        $(".themeId").click(function () {
            var themeId = $(this).data("themeid");
            cl = "upt_on"
            $(".themeId").removeClass(cl);
            $(this).addClass(cl);
            $("#themeId").val(themeId);
            $("#currentPage").val(1);
            $("#searchForm").submit();
        })
        $(".month").click(function () {
            var month = $(this).data("month");
            cl = "upt_on"
            $(".month").removeClass(cl);
            $(this).addClass(cl);
            $("#month").val(month);
            $("#currentPage").val(1);
            $("#searchForm").submit();
        })

    </script>
</div>
<#include "../common/footer.ftl">
</body>
</html>